<!doctype html>
<html lang="en" class="fixed">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>手动购课</title>
    <link rel="apple-touch-icon" sizes="120x120" href="favicon/apple-icon-120x120.png">
    <link rel="icon" type="image/png" sizes="192x192" href="favicon/android-icon-192x192.png">
    <link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
    <link rel="stylesheet" type="text/css"
          href="<?php xcho(loadSource('/assets/plugins/bootstrap/css/bootstrap.min.css')) ?>">
    <link rel="stylesheet" type="text/css"
          href="<?php xcho(loadSource('/assets/plugins/bootstrap/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/animate.css/animate.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/font-awesome/css/font-awesome.css')) ?>">
    <link rel="stylesheet"
          href="<?php xcho(loadSource('/assets/plugins/data-table/media/css/dataTables.bootstrap.min.css')) ?>">
    <!--    <link rel="stylesheet" href="-->
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/layui/css/layui.css')) ?>" media="all">
    <?php //xcho(loadSource('/assets/plugins/ztree/css/zTreeStyle/zTreeStyle.css')) ?><!--">-->
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/ztree/css/metroStyle/metroStyle.css')) ?>"
          type="text/css">
    <link rel="stylesheet" href="<?php xcho(loadSource('/app/css/style.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/app/css/app.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/css/new_main.css')) ?>">
    
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        ul, li, ol, li {
            list-style: none;
        }

        body {
            background: #f4f4f4;
        }

        .addCourse {
            width: 900px;
            margin: 0 auto;
            background: #fff;
        }

        .addCourse .addCourse-title {
            padding: 10px 20px;
            text-align: center;
        }

        .addCourse .addCourse-content .addCourse-cont h3 {
            font-size: 12px;
            padding: 8px 10px;
            background: rgba(243, 243, 243, .5);
            margin-top: 0;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form {
            padding: 0 20px 20px;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form .form-row {
            margin-top: 20px;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form .form-row p {
            float: left;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form .form-row textarea {
            resize: none;
            border-radius: 5px;
            border: 1px #ccc solid;
            text-indent: 10px;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form span {
            margin-left: 40px;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form span:nth-of-type(1) {
            margin-left: 0;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form select {
            width: 170px;
            border-radius: 5px;
            height: 24px;
            border: 1px #ccc solid;
            font-size: 12px;
        }

        .addCourse .addCourse-content .addCourse-cont .cont-form input {
            border: 1px #ccc solid;
            border-radius: 5px;
            text-indent: 10px;
        }

        .addCourse .addCourse-content .addCourse-cont .addCourse-btn {
            width: 100%;
            height: 40px;
            padding: 0 20px;
        }

        .addCourse .addCourse-content .addCourse-cont .addCourse-btn .addCourse-btn-cont {
            float: right;
        }

        .addCourse .addCourse-content .addCourse-cont .addCourse-btn .addCourse-btn-cont button {
            padding: 2px 10px;
            border: none;
            background: rgba(16, 142, 233, .6);
            color: #fff;
            border-radius: 5px;
            color: #fff;
            margin-right: 10px;
            font-size: 12px;
        }

        .addCourse .addCourse-content .addCourse-cont .addCourse-btn .addCourse-btn-cont button:hover {
            background: #1ab394;
        }

        .addCourse .addCourse-content .addCourse-cont .addCourse-btn .addCourse-btn-cont button:nth-of-type(1) {
            background: #fff;
            color: #888;
            border: 1px #ccc solid;
        }

        .addCourse .addCourse-content .addCourse-cont .table {
            padding: 0 20px;
        }

        .addCourse .addCourse-content .addCourse-cont .table table {
            width: 100%;
        }

        .addCourse .addCourse-content .addCourse-cont .table table thead tr {
            background: #1ab394;
        }

        .addCourse .addCourse-content .addCourse-cont .table table thead tr th {
            padding: 10px 0;
            color: #fff;
            text-align: center;
        }

        .addCourse .addCourse-content .addCourse-cont .table table tbody tr {

        }

        .addCourse .addCourse-content .addCourse-cont .table table tbody tr:nth-of-type(even) {
            background: rgba(238, 238, 238, .5);
        }

        .addCourse .addCourse-content .addCourse-cont .table table tbody tr td {
            padding: 6px 0;
            text-align: center;
            color: #333;
        }

        .addCourse .addCourse-content .addCourse-cont .table table tbody tr td input {
            width: 100px;
            border: none;
            border: 1px #ccc solid;
            border-radius: 5px;
            text-indent: 10px;
        }

        .addCourse .addCourse-content .addCourse-cont .table ul {
            margin-top: 10px;
        }

        .addCourse .addCourse-content .addCourse-cont .table ul li {
            display: inline-block;
            width: 33%;
            text-align: left;
        }
    </style>
</head>

<body><?php include_once TPL_PATH . 'public/nav.phtml'; ?>
<div class="addCourse">

    <div class="addCourse-title"><?php xcho($student_data['sname']??'')?>-收费</div>

    <div class="addCourse-content">
        <div class="addCourse-cont">
            <h3>订单信息</h3>
            <div class="table">
                <input type="hidden" id="student_id" name="student_id" value="<?php xcho($student_id)?>">
                <input type="hidden" id="tmk_id" name="tmk_id" value="<?php xcho($student_data['tmk_id']??'')?>">
                <input type="hidden" id="cc_id" name="cc_id" value="<?php xcho($student_data['cc_id']??'')?>">
                <button id="selectCourse" url="<?php xcho($sSearchCourse) ?>">选择课程</button>
                <table class="sumTable">
                    <thead>
                    <tr>
                        <th>课程名</th>
                        <th>单小时价格</th>
                        <th>小时数</th>
                        <th>原价</th>
                        <th>单小时购买价</th>
                        <th>购买小时</th>
                        <th>购买价</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
                <ul>
                    <li>原价：<span id="original_price">0</span></li>
                    <li>应收：<span id="real_price">0</span></li>
                    <li>优惠：<span id="preferential">0</span></li>
                </ul>
            </div>
            <h3>收费信息</h3>
            <div class="cont-form">
                <div class="form-row">
                    <span>实收：</span>
                    <input type="text" class="input_change" id="price" name="price" value="0" placeholder="" class="int">
                    <span>支付方式：</span>
                    <select name="ptype" id="ptype">
                        <?php foreach ($aPtypeList as $aTmp) { ?>
                            <option value="<?php xcho($aTmp['dict_value']) ?>"><?php xcho($aTmp['cn_name']) ?></option>
                        <?php } ?>
                    </select>
                    <span>待收：</span>
                    <span id="wait_pay"></span>
                </div>
                <div class="form-row">
                    <span>收费日期：</span>
                    <input size="16" type="text" id="ptime" name="ptime" class="form_datetime" value="<?php xcho(date('Y-m-d H:i',time()))?>">
                </div>
                <div class="form-row">
                    <p>添加备注：</p>
                    <textarea name="remark" id="remark" cols="110" rows="3" placeholder="请输入备注"></textarea>
                </div>
            </div>
            <div class="addCourse-btn">
                <div class="addCourse-btn-cont">
                    <span class="layui-btn layui-btn-primary" id="bCancle">取消</span>
                    <span class="layui-btn" id="bSave" url="<?php xcho($sSaveUrl) ?>">确定</span>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<input type="hidden" id="tempString" name="tempString"/>
<script src="<?php xcho(loadSource('/assets/plugins/jquery/jquery.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/layui/layui.all.js')) ?>" charset="utf-8"></script>
<script src="<?php xcho(loadSource('/assets/plugins/bootstrap/js/bootstrap.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/bootstrap/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/data-table/media/js/jquery.dataTables.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/data-table/media/js/dataTables.bootstrap.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/layer-v3.0.3/layer/layer.js')) ?>"></script>
<script
        src="<?php xcho(loadSource('/assets/plugins/data-table/extensions/Responsive/js/dataTables.responsive.min.js')) ?>"></script>
<script
        src="<?php xcho(loadSource('/assets/plugins/data-table/extensions/Responsive/js/responsive.bootstrap.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/ztree/js/jquery.ztree.core.js')) ?>"></script>
<script type="text/javascript"
        src="<?php xcho(loadSource('/assets/plugins/ztree/js/jquery.ztree.excheck.js')) ?>"></script>
<script type="text/javascript"
        src="<?php xcho(loadSource('/assets/plugins/ztree/js/jquery.ztree.exedit.js')) ?>"></script>
<script type="text/javascript"
        src="<?php xcho(loadSource('/assets/js/validate.js')) ?>"></script>
<script>
    $(".form_datetime").datetimepicker({
        format: "yyyy-mm-dd hh:ii",
        todayHighlight:true,
        language:'zh-CN',
        autoclose:true
    });
    $("#selectCourse").on('click', function () {
        var index = layer.open({
            type: 2
            , title: false //不显示标题栏
            , closeBtn: false
            , area: 'auto'
            , shade: 0.8
            , id: 'LAY_layuipro' //设定一个id，防止重复弹出
            , btn: ['确定', '取消']
            , moveType: 1 //拖拽模式，0或者1
            , content: $(this).attr('url')
            , yes: function (index, layero) {
                var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象
                var oTrList = iframeWin.selectCourse();//执行子页面方法
                $(".sumTable tbody").append(oTrList);
                layer.close(index);
                var bIsHaveId = 'no';
                sumNum(bIsHaveId);
                $(".input_change").change(function () {
                    this.value = this.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符
                    this.value = this.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的
                    this.value = this.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
                    this.value = this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');//只能输入两个小数
                    if(this.value.indexOf(".")< 0 && this.value !=""){
                        //以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
                        this.value= parseFloat(this.value);
                    }
                    if(this.value == ""){
                        //此处控制为空时重置为0
                        this.value= 0;
                    }
                    if($(this).attr('id') == 'price') {
                        bIsHaveId = 'yes';
                    } else {
                        bIsHaveId = 'no';
                    }
                    sumNum(bIsHaveId);
                });
                $(".delte-tr").on('click', function () {
                    $("#original_price").text((parseFloat($("#original_price").text()) -
                        parseFloat($(this).parent().siblings().eq(3).text())).toFixed(2));
                    $("#real_price").text((parseFloat($("#real_price").text()) -
                        parseFloat($(this).parent().siblings().eq(6).find("input").val())).toFixed(2));
                    $("#preferential").text((parseFloat($("#original_price").text()) - parseFloat($("#real_price").text())).toFixed(2));
                    $(this).parent().parent().remove();
                    bIsHaveId = 'no';
                    sumNum(bIsHaveId);
                })
            }
        });
        layer.full(index);
    });

    //购买小时购买价变更统一计算
    function sumNum(bIsHaveId) {
        var sum_total = 0,sumOld_total = 0;
        $(".sumTable tbody>tr").each(function () {
            $(this).find("td[name='real_average_price']").text((
                $(this).find("td[name='real_price']>input").val() /
                $(this).find("td[name='real_duration']>input").val()
            ).toFixed(2));
            sumOld_total = (parseFloat(sumOld_total) + (parseFloat($(this).find("td[name='original_average_price']").text()) * parseFloat($(this).find("td[name='real_duration']>input").val()))).toFixed(2);
            sum_total = (parseFloat(sum_total) + parseFloat($(this).find("td[name='real_price']>input").val())).toFixed(2);
        })

        $("#real_price").text(parseFloat(sum_total).toFixed(2));
        if(bIsHaveId == 'no') {
            $("#price").val(parseFloat(sum_total).toFixed(2));
        }
        $("#original_price").text(parseFloat(sumOld_total).toFixed(2));
        $("#preferential").text((sumOld_total - sum_total).toFixed(2));
        $("#wait_pay").text((sum_total - parseFloat($("#price").val()))>0?(sum_total - parseFloat($("#price").val())).toFixed(2):0);
    }


    //提交数据
    $("#bSave").on('click',function () {
        var isContine = validateF();
        if(!isContine) return false;
        $(".hidden_area").remove();
        var aCourseIds = [];
        var aOrderData = {};
        var aOrderDetails = [];
        var aOrderPayment = {};
        $(".sumTable tbody>tr").each(function () {
            var oTds = $(this).find('td');
            var aOrderDetail = {
                'student_id':$("#student_id").val(),
                'course_id':$(oTds).eq(0).attr('course-id'),
                'real_price':parseFloat($(oTds).eq(6).find('input').val()*100).toFixed(),
                'real_duration':parseFloat($(oTds).eq(5).find('input').val()*60).toFixed(),
            };
            aOrderDetails.push(aOrderDetail);
            aCourseIds.push($(oTds).eq(0).attr('course-id'));
        });
        aOrderData = {
            'student_id': $("#student_id").val(),
            'tmk_id': $("#tmk_id").val(),
            'cc_id': $("#cc_id").val(),
            'original_price': parseFloat($("#original_price").text()*100).toFixed(),
            'real_price': parseFloat($("#real_price").text()*100).toFixed(),
            'income': parseFloat($("#price").val()*100).toFixed(),
            'aCourseIds':aCourseIds,
            'course_ids': aCourseIds.join(','),
        };
        aOrderPayment = {
            'ptype':$("#ptype").val(),
            'ptime':$("#ptime").val(),
            'price':parseFloat($("#price").val()*100).toFixed(),
            'remark':$("#remark").val(),
        };
        $.ajax({
            url:$(this).attr('url'),
            data:{
                'aOrderData':aOrderData,
                'aOrderDetails':aOrderDetails,
                'aOrderPayment':aOrderPayment,
            },
            type:'POST',
            dataType:'json',
            success: function (data) {
                if(data.success==1){
                    $("#bCancle").trigger("click");
                }else{
                    $.each(data.errors,function (sKey,aVal) {
                        $("[name='"+sKey+"']").after("<span class='hidden_area' style='color: red;padding-top: 5px;'>"+aVal['message']+"</span>");
                    })
                }
            }
        });

    })

    //关闭手动购课
    $("#bCancle").on('click',function () {
        window.close();
    });
</script>
<?php include_once TPL_PATH . 'public/foot_script.phtml'; ?>
<button id="top" style="height: 50px;width: 50px;"></button></body>
</html>
